﻿<%@ Page Language="C#" AutoEventWireup="true" CodeFile="test4.aspx.cs" Inherits="test4" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta name="description" content="" />
    <meta name="author" content="" />
    <link href="img/uboxiconR-02.ico" rel="SHORTCUT ICON" />
    <title>UBOX</title>

    <!-- Bootstrap Core CSS -->

    <%--<link href="sd/css/bootstrap.min.css" rel="stylesheet" />--%>
    <link href="Content/bootstrap.min.css" rel="stylesheet" />
    <link href="Content/bootstrap-theme.min.css" rel="stylesheet" />
    <!-- Custom CSS -->

    <link href="sd/css/sb-admin.css" rel="stylesheet" />
    <!-- Morris Charts CSS -->

    <link href="sd/css/plugins/morris.css" rel="stylesheet" />

    <!-- Custom Fonts -->

    <link href="sd/font-awesome-4.1.0/css/font-awesome.min.css" rel="stylesheet" type="text/css" />

    <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <%--[if lt IE 9]>--%>
    <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
    <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
    <%--<![endif]--%>

    <%--<script src="Scripts/responsive-nav.min.js"></script>--%>


    <script src="Content/js/jquery.js"></script>


    <%--<script src="Scripts/jquery-2.1.1.min.js"></script>--%>
    <%--<script src="Scripts/bootstrap.min.js"></script>--%>

    <script src="Content/js/jquery.MyFloatingBg.js"></script>

    <style>
        body {
            /*margin-top: 100px;*/
            /*overflow-y:hidden;*/
            display: block;
            margin: 0px;
            background-color: #999;
            /*background-color: #f8f8f8 ;*/
            
        }


        .container {
            padding-top: 180px;
            margin: 0 auto;
        }

        .m {
            z-index: -2;
            position: fixed;
            top: 0px;
            left: 0px;


            filter: url(blur.svg#blur); /* FireFox, Chrome, Opera */
            -webkit-filter: blur(2.5px); /* Chrome, Opera */
            -moz-filter: blur(2.5px);
            /*-ms-filter: blur(2.5px);*/
            filter: blur(2.5px);
            filter: progid:DXImageTransform.Microsoft.Blur(PixelRadius=2.5, MakeShadow=false); /* IE6~IE9 */

        }


        .form-signin {
            max-width: 330px;
            padding: 15px;
            margin: 0 auto;
        }

            .form-signin .form-signin-heading,
            .form-signin .checkbox {
                margin-bottom: 10px;
            }

            .form-signin .checkbox {
                font-weight: normal;
            }

            .form-signin .form-control {
                position: relative;
                height: auto;
                -webkit-box-sizing: border-box;
                -moz-box-sizing: border-box;
                box-sizing: border-box;
                padding: 10px;
                font-size: 16px;
            }

                .form-signin .form-control:focus {
                    z-index: 2;
                }

            .form-signin input[type="email"] {
                margin-bottom: -1px;
                border-bottom-right-radius: 0;
                border-bottom-left-radius: 0;
            }

            .form-signin input[type="password"] {
                margin-bottom: 10px;
                border-top-left-radius: 0;
                border-top-right-radius: 0;
            }


            .login-panel {
            border-width: 0px;
            background: rgba(0,0,0,0.7);
            background: #000 9; /*CSS Hack,只能对ie9以下浏览器ie6,ie7,ie8有效，否侧ie10,FF,Cherome会失去透明效果*/
            filter: Alpha(opacity=60); /*只对ie7,ie8有效*/
            box-shadow:0.6em 0px 15px rgba(0,0,0,0.5), -0.6em 0px 15px rgba(0,0,0,0.5);
        }

        

        @media screen and (min-width:992px) {
            .container {
                margin:0 auto;
               
            }
        }


        @media screen and (max-width: 992px) {
            .container {
                margin: 0 auto;
            }
          

            @media screen and (min-width: 480px) {
                .container {
                    margin: 0 auto;

                }
            }
        }
    </style>
     <script type="text/javascript">

         $(document).ready(function () {
             //weather
             $(".m").css("width", $(window).width()).css("height", $(window).height());
             $("#demoDiv1").MyFloatingBg({ direction: -2 });
             $(window).resize(function () {
                 
                 $(".m").css("width", $(window).width()).css("height", $(window).height());
                 //$("#demoDiv1").MyFloatingBg({ speed: 50, direction: -1 });
             });

             //$(".container").css("width", $(window).width()).css("height", $(window).height());
         });
    </script>

</head>
<body>
    
    
    <div class="container">
        <div class="row">
            <div class="col-md-4 col-md-offset-4">
                <div class="login-panel panel panel-default">
                    <div class="panel-heading">
                        <h3 class="panel-title"><img src="img/uboxiconR-02.png" />&nbsp;UBOX登入</h3>
                    </div>

                    <div class="panel-body">
                        <form role="form" class="form-signin">
                            <fieldset>
                                <div class="form-group">
                                    <input class="form-control" placeholder="E-mail" name="email" type="email" title="E-mail" />
                                </div>
                                <div class="form-group">
                                    <input class="form-control" placeholder="Password" name="password" type="password" value="" title="密碼"/>
                                </div>
                                <div class="checkbox">
                                    <h5><label>
                                        <input name="remember" type="checkbox" value="Remember Me" title="Remember Me" /><span style="color:#fff">Remember Me</span>
                                    </label></h5>
                                </div>
                                <!-- Change this to a button or input when using this as a form -->


                                    <a href="#" class="btn btn-lg btn-success btn-block" title="登入"><span class="add-on"><i class="glyphicon glyphicon-ok" style="color:#fff"></i></span>&nbsp;&nbsp;Log in</a>


                            </fieldset>
                        </form>
                        <hr />

                        <div class="row text-center">

                            <div class="col-md-12 col-sm-12">
                                
                                <button type="button" class="btn btn-primary btn-block" title="Facebook">Facebook</button>
                            </div>

  
                            <%--<div class="col-md-4 col-sm-12">
            <button type="button" class="btn btn-info btn-block">Twitter</button>
        </div>--%>

                            <div class="col-md-12 col-sm-12">
                                <button type="button" class="btn btn-danger btn-block" title="Google+">Google+</button>
                            </div>

                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div id="demoDiv1" bg="img/page01-1-02.png" class="m">
        <%--<div style="color: #fff">
         </div> --%> 
    </div>
    



</body>
</html>
